<script setup lang="ts">
import { Table } from '@/components/Table'
import { useCrudSchemas } from '@/hooks/web/useCrudSchemas'
import { useTable } from '@/hooks/web/useTable'
import {unref, h ,reactive, ref, watch} from 'vue'
import {getCouponTable } from '@/api/Coupon'
import formatDate from '@/utils/Time'
const columns =reactive([
    {
        field:'coupon_name',
        label:'优惠券名称'
    },
    {
        field:'coupon_price',
        label:'面额'
    },
    {
        field:'type',
        label:'使用条件',
        formatter: (_: Recordable, __: TableColumn, cellValue: number) => {
            if(cellValue===2){
            return '商品'
            }
            if(cellValue===3){
            return '视频'
            }
            if(cellValue===4){
            return '无限制' 
            }
            
        },
       
    }, 
    {
        field:'starAndEnd',
        label:'有效期'
    },

])

const { allSchemas } = useCrudSchemas(columns)
const { register, tableObject, methods,elTableRef } = useTable({
  getListApi: getCouponTable,
})
const { getList,setSearchParams } = methods

const obj = reactive({
    online: 2,
    surplus: 1
})
tableObject.params=Object.assign(tableObject.params, {
    ...obj
})
getList()
defineExpose({
  elTableRef,
  getSelections: methods.getSelections
})
</script>

<template>
    <Table
          v-model:pageSize="tableObject.pageSize"
          v-model:currentPage="tableObject.currentPage"
          :loading="tableObject.loading"
          :columns="allSchemas.tableColumns"
          :data=" 
            tableObject.tableList.slice((tableObject.currentPage - 1) * tableObject.pageSize,tableObject.currentPage * tableObject.pageSize)"
          :pagination="{
            total: tableObject.total
          }"
          @register="register">
            <template #starAndEnd="{row}" >
                {{formatDate(row.start_date,'yyyy-MM-dd')+'--'+formatDate(row.end_date,'yyyy-MM-dd')}}
            </template>
        </Table>
</template>
